<template>
  <f7-page>
    <f7-navbar title="提现设置" back-link="返回">
    </f7-navbar>
    <form class="list inline-labels no-hairlines-md">
      <ul>
        <li>
          <div class="item-content item-input">
            <div class="item-inner">
              <div class="item-title item-label">物流管理员（%）</div>
              <div class="item-input-wrap">
                <input type="text" placeholder="请输入" v-model="traffic_employee" class="text-align-right">
              </div>
            </div>
          </div>
        </li>
        <li>
          <div class="item-content item-input">
            <div class="item-inner">
              <div class="item-title item-label">外部合作车队（%）</div>
              <div class="item-input-wrap">
                <input type="text" placeholder="请输入" v-model="traffic_captain" class="text-align-right">
              </div>
            </div>
          </div>
        </li>
      </ul>
    </form>
    <f7-toolbar class="row">
      <f7-button class="col" big fill @click="savePerce()">确认设置</f7-button>
    </f7-toolbar>
  </f7-page>
</template>

<script>
export default {
  data () {
    return {
      traffic_employee: '',
      traffic_captain: ''
    }
  },
  methods: {
    formvalidator (type, param) {
      let finalFmv = {
        status: true,
        msg: ''
      };
      let all = {
        savePerce () {
          if (!param.traffic_employee) {
            finalFmv.status = false;
            finalFmv.msg = '请填写物流管理员信息费提现比例\n'
          } else if (!param.traffic_captain) {
            finalFmv.status = false;
            finalFmv.msg = '请填写外部合作车队信息费提现比例'
          } else {
            finalFmv.status = true;
          }
        }
      }
      all[type]();
      return finalFmv;
    },
    async getPerce () {
      let getPerceRep = await this.AccountService.getPerce()
      if (getPerceRep.data.status === 'success') {
        let data = getPerceRep.data.data
        if (data) {
          this.traffic_employee = data.traffic_employee
          this.traffic_captain = data.traffic_captain
        } else {
          this.traffic_employee = ''
          this.traffic_captain = ''
        }
      } else {
        console.error(getPerceRep.data.data)
      }
    },
    async savePerce () {
      let param = {
        traffic_employee: Number(this.traffic_employee),
        traffic_captain: Number(this.traffic_captain)
      }
      let finalFmv = this.formvalidator('savePerce', param);
      if (!finalFmv.status) {
        this.toast(finalFmv.msg)
        return false
      }
      let savePerceRep = await this.AccountService.savePerce(param)
      this.toast('保存成功')
      $state.go('rsc.company_manager')
      this.$f7.router.navigate({ url: '/mine/' })
    }
  },
  mounted () {
    this.getPerce()
  }
}
</script>

<style scoped>
.ios .list {
  margin: 15px 0 0 0;
}
.ios .inline-labels .item-label {
  font-size: 14px;
}
.ios .list input[type='text'] {
  font-size: 14px;
}
.ios .button.button-fill {
  background: #a3a2f0;
  color: #fff;
  border-radius: 0;
  font-size: 14px;
}
</style>
